<template>
	<view class="all">
		<view class="item-it" v-for="(item, index) in dataList" :key='index' @click="sevideo(index)">
			<image :src="item.image" class="img2"></image>
			<view class="item-centr">
				<text class="t1">{{item.good.title}}</text>
				<view class="item-but">
					<view class="but-ti">￥{{item.good.price}}</view>
					<view class="but-b" @click.stop="getshopDetails(item.good.id)">购买</view>
				</view>
			</view>
		</view>
	</view>	
</template>
		
<script>
	export default{
		data(){
			return {
				dataList: []
			}
		},
		onLoad(option) {
			this.dataList =JSON.parse(option.videoList);
		},
		methods:{
			getshopDetails(id) {
				uni.navigateTo({
					url: '/pages/product/product?id='+id
				});
			},
			sevideo(index){
			 let vidoLi = [this.dataList[index]];
			 let vid = this.dataList[index].id;
				uni.navigateTo({
					url:`../video/sjvideo?videoList=${JSON.stringify(vidoLi)}&vid=${vid}`
				})
			}
		},
		onPullDownRefresh(){
			setTimeout(()=>{
				uni.stopPullDownRefresh();
			}, 2000)
			
		}
	}
</script>

<style>
	.all{
		width: 90%;
		margin: 0 auto;
		padding: 0;
		font-size: 30upx;
	}
	.item-it{
		width: 100%;
		display: flex;
		justify-content: flex-start;
		padding: 10upx 0px;
	}
	.item-it image{
		height: 240upx;
	}
	.img2{
		width: 300upx;
		max-width: 300upx;
		min-width: 300upx;
	}
	.item-centr{
		height: 240upx;
		display: flex;
		width: 100%;
		justify-content: space-between;
		flex-direction: column;
	}
	.t1{
		color: #000000;
		font-size: 30upx;
		/* letter-spacing: 2upx; */
		margin-left: 15upx;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 3;
		overflow: hidden;
	}
	.item-but{
		margin-left: 15upx;
		display: flex;
		justify-content: space-between;
		
	}
	.but-ti{
		color: #FF4937;
	}
	.but-b{
		padding: 15upx 20upx;
		background: #FF4937;
		color: #fff;
		border-radius: 10upx;
	}
</style>
